<template>
	<view class="city-select">
		<up-index-list :index-list="indexList" :custom-nav-height="50">
				<template v-for="(item, index) in itemArr">
					<up-index-item>
						<view class="list-cell" v-for="(cell, index) in item" @click="selectCity(cell)">
							{{cell}}
						</view>
					</up-index-item>
				</template>
			</up-index-list>
	</view>
</template>

<script setup>
	import { ref } from 'vue';  
	  
	// 创建响应式数据  
	const indexList = ref(["A", "B", "C"]);  
	const itemArr = ref([  
	  ['安阳'],  
	  ['北京'],  
	  ['承德']  
	]); 
	const selectCity = (city) => {
		console.log('city是'+ city)
		uni.navigateBack({
			success() {
				uni.$emit('changeCity', city)
			}
		})
	}
</script>

<style lang="scss" scoped>
	.city-select{
		position: relative;
	}
	.list-cell {
			display: flex;
			box-sizing: border-box;
			width: 100%;
			padding: 10px 24rpx;
			overflow: hidden;
			color: #323233;
			font-size: 14px;
			line-height: 24px;
			background-color: #fff;
		} 
</style>
